<template>
    <div class="home">
        <!-- 轮播图 -->
        <swiper :bannerList="bannerList"></swiper>
        <div v-for="(item,index) in 1" :key="index">
            <div class="flex flexCenter h50 caozhi" v-if="tuijianName">
                <span class="bold fs18">{{tuijianName || '超值推荐'}}</span>
            </div>
            <tuijian :tuiJianList="tuiJianList"></tuijian>
            <div class="flex flexCenter h44 caozhi">
                <span class="bold fs18">{{tehuiName || '特惠券'}}</span>
            </div>
            <div class="flex flexCenter pl10 pr10 boxB tehui">
                <img class="wh100 br6" :src="tehuiList" alt="" @click="clickTeHui">
            </div>
            <discount-goods :discountList="discountList" :title="discountName"></discount-goods>
        </div>
        <x-button @click.native="toNext('classification')">显示更多</x-button>
        <botNavigation />
    </div>
</template>

<script>
import swiper from './swiper.vue';
import tuijian from './tuijian.vue';
import { queryModuleList, getHomeshuimg } from 'request';
import { Toast } from "mint-ui";
import { XButton } from 'vux';
import mixins from 'mixins';
import { shareIndex } from 'src/methods/baseinfo.js';
export default {
    name: "home",
    mixins:[mixins],
    data() {
        return {
            msg: "122222",
            dataList:[],            //商品所有数据
            bannerList:[],          //banner图列表
            tuiJianList:[],         //推荐商品列表
            tuijianName:'',         //超值推荐名称
            tehuiList:[],           //特惠商品列表
            tehuiName:'',           //特惠商品名称
            tehuiUrl:'',            //超值推荐地址
            discountList:[],        //优惠商品列表
            discountName:'',        //优惠商品名称
        };
    },
    computed:{
        imgUrl(){
            return this.$store._modules.root._children.a.state;
        },
    },
    beforeRouteEnter(to,from,next){
        //显示首页分享,必须写在路由钩子里面，不然只会调用一次
        shareIndex();
        next();
    },
    created(){
        this.$vux.loading.show({ text:'loading' });
        //获取主体数据
        queryModuleList({}).then(res=>{
            let self = this;
            this.$vux.loading.hide();
            if(res.rspCode == '0000'){
                try{
                    this.dataList = [...res.data];
                    res.data.forEach(item=>{
                        if(item.bannerType == '00'){
                            self.tuijianName = item.moduleName;
                            self.tuiJianList = item.hotProductList.map(val=>{
                                val.coverPicUrl = self.imgUrl + val.coverPicUrl;
                                return val;
                            });
                        }else if(item.bannerType == '01'){
                            self.tehuiName = item.moduleName;
                            self.tehuiList = self.imgUrl + item.moduleBannerList[0]["picUrl"];
                            self.tehuiUrl = item.moduleBannerList[0]["url"];
                        }else if(item.bannerType == '02'){
                            self.discountName = item.moduleName;
                            let arr = item.productList.map(val=>{
                                val.coverPicUrl = self.imgUrl + val.coverPicUrl;
                                return val;
                            });
                            self.discountList = arr;
                            this.$store.commit('addContentGoods',[...arr]);
                       }
                    });
                }catch (err){
                    console.log('数据返回出错 - ',err)
                }
            }else{
                Toast({ message:res.rspMsg || '数据请求失败',duration:3000});
            }
        }).catch(err=>{
            this.$vux.loading.hide();
            Toast({ message:'数据请求失败',duration:3000});
        });
        //获取轮播图数据
        getHomeshuimg({}).then(res=>{
            if(res.rspCode == '0000'){
                this.bannerList = res.data.bannerList.map(item=>{
                    item.picUrl = this.imgUrl + item.picUrl;
                    return item;
                });
            }
        })
    },
    methods:{
        clickTeHui(){
            window.location.href = this.tehuiUrl;
        }
    },
    mounted(){
        //设置页面像素级别
        document.documentElement.style.fontSize = window.innerWidth / 37.5 + 'px';
    },
    components: {
        swiper,
        tuijian,
        XButton,
    }
};
</script>
<style scoped lang="less">
@import './index.less';
</style>
